<template>
    <el-dialog
        v-model="serviceContainerDeployDialogVisible"
        title="容器部署"
        width="20%"
        align-center
        :show-close="false"
        :close-on-click-modal="false"
    >
        是否确定部署该容器？
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="cancelDialog()">取 消</el-button>
                <el-button type="primary" :loading="saveLoading" @click="submitDialog()">
                    确认
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>

<script>
import {containerSimpleDeployInfo} from "@/request/container";
import {ElNotification} from "element-plus";

export default {
    name: "ContainerSimpleDeployDialog",
    props: ['containerForm'],
    data() {
        return {
            saveLoading: false
        }
    },
    methods: {
        cancelDialog() {
            this.$store.commit('changeServiceContainerDeployDialogVisible', false);
        },
        submitDialog() {
            this.saveLoading = true
            containerSimpleDeployInfo(this.containerForm).then(res => {
                if (res.code === '200') {
                    ElNotification({
                        title: 'Success',
                        message: res.message,
                        type: 'success'
                    });
                    this.$store.commit('changeServiceContainerDeployDialogVisible', false);
                }
                this.saveLoading = false
            }).catch(res => {
                this.saveLoading = false
            })
        }
    },
    computed: {
        serviceContainerDeployDialogVisible() {
            return this.$store.state.serviceContainerDeployDialogVisible;
        }
    }
}
</script>

<style scoped>

</style>